<template>
  <div class="public bg-hex-F5F5F5">
    <!-- 顶部 -->
    <div class="h-200rpx" />
    <div class="fixed left-0 right-0 top-0 z-9 h-200rpx bg-hex-ffffff">
      <image class="pointer-events-none absolute left-0 right-0 top-0 w-full" :src="`${cdnUrl}/imgs/detail/bg.png${imgVersion}`"
             mode="aspectFill" />
      <div
        class="z-999 inline-block w-24% flex items-center pb-40rpx"
        :style="{ paddingTop: `${searchBarTop}px` }"
        @click.stop="goBack">
        <uni-icons type="back" size="28" />
        <text class="text-36rpx font-600">返回</text>
      </div>
    </div>
    <!-- 底部tab栏 -->
    <div v-show="keyboardHeight===0" class="footer-tab fixed bottom-108rpx left-0 right-0 z-999 box-border h-102rpx bg-hex-F5F5F5">
      <div class="h-96rpx flex items-start justify-around">
        <div v-for="item in tabList" class="relative mt-32rpx flex flex-col items-center justify-center text-28rpx text-hex-666"
             @click="changetabindex(item.id)">
          <div v-if="tabindex===item.id" class="triangle absolute -top-37rpx" />
          <text class="z-9 text-28rpx" :class="{ 'text-32rpx text-hex-000': tabindex === item.id }">{{ item.text }}</text>
          <image v-if="tabindex===item.id" class="h-30rpx w-64rpx -mt-10rpx"
                 :src="`${cdnUrl}/imgs/square/selected.png${imgVersion}`" mode="scaleToFill" />
        </div>
      </div>
    </div>
    <!-- 发动态 -->
    <div v-if="tabindex==='1'" class="bg-hex-ffffff">
      <div class="box-border px-32rpx">
        <div class="flex flex-wrap">
          <div
            v-for="(item, index) in fileLists"
            class="relative mb-25rpx mr-25rpx h-152rpx w-152rpx flex flex-col items-center justify-center rounded-20rpx bg-hex-F5F5F5">
            <image
              class="absolute left-50% top-50% h-152rpx w-152rpx rounded-16rpx"
              style="transform: translate(-50%, -50%);"
              :src="item"
              mode="aspectFill"
              @click="previewImage(index)"
            />
            <div
              class="absolute bottom--18rpx right--18rpx h-40rpx w-40rpx border rounded-50% bg-[rgba(0,0,0,0.7)]"
              @click.stop="deleteImg(index)">
              <image
                class="h-40rpx w-40rpx"
                :src="`${cdnUrl}/imgs/mine/close.png${imgVersion}`"
                mode="scaleToFill"
              />
            </div>
          </div>
          <div class="mb-20rpx h-152rpx w-152rpx flex flex-col items-center justify-center rounded-20rpx bg-hex-F5F5F5"
               @click.stop="select">
            <uni-icons type="plusempty" size="30" color="#D9D9D9" />
          </div>
        </div>
        <div class="tablist fixed bottom-320rpx left-0 right-0 z-99 h-102rpx bg-hex-FFFFFF px-32rpx" :class="{ 'bottom-620rpx': isShowColumn }">
          <div class="mb-24rpx flex items-center justify-between text-28rpx text-hex-7C8699" @click="handleShowColumn">
            <div>{{ columnName }}</div>
            <uni-icons :type="isShowColumn?'top':'bottom'" size="16" />
          </div>
          <div v-if="isShowColumn" class="columns box-border max-h-350rpx overflow-y-auto rounded-30rpx bg-hex-F6F6F6 p-32rpx">
            <div v-for="item in categoryList" class="mb-32rpx text-28rpx text-hex-7c8699"
                 :class="columnName===item.name ? 'text-hex-000000 font-700 text-34rpx':''"
                 @click="changecolumnId(item)">{{ item.name }}</div>
          </div>
        </div>
        <div class="max-h-600rpx overflow-y-scroll">
          <uni-easyinput v-model="dynamicContent" bindinput="inputHandler" :inputBorder="false" maxlength="120"
                         autoHeight type="textarea"
                         placeholderStyle="color:#C4C4C4;font-size:32rpx"
                         placeholder="快来写下当前的动态,让更多人看到吧~" />
        </div>
        <div class="operate fixed bottom-210rpx left-0 right-0 z-99 h-122rpx bg-hex-F5F5F5">
          <div class="rounded-b-30rpx bg-hex-ffffff px-32rpx">
            <div class="mb-11rpx h-2rpx w-full bg-hex-F5F5F5" />
            <div class="h-102rpx flex items-center justify-between">
              <div class="text-24rpx text-hex-7C8699"><text class="text-hex-C4C4C4">{{ dynamicContent.length }}</text>/120</div>
              <div class="flex items-center">
                <div class="font-theme mr-32rpx text-28rpx" @click.stop="goadd('1', '1')">存草稿</div>
                <div class="btn-theme-bg h-62rpx min-w-140rpx rounded-12rpx text-center text-28rpx leading-62rpx text-hex-fff"
                     @click.stop="goadd('1', '0')">发布</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 写文章 -->
    <div v-if="tabindex==='2' && secondindex ==='1'" class="rounded-b-30rpx bg-hex-ffffff">
      <div class="box-border px-32rpx">
        <div class="wealth-text w-full bg-hex-F5F5F5">
          <input v-model="articleTitle" maxlength="30" type="text"
                 class="h-100rpx w-full bg-hex-fff text-36rpx"
                 placeholder="请输入标题(限5-30字)">
          <!-- keyboardHeight：键盘高度；50是键盘弹起的工具栏高度 -->
          <qqyEditor
            ref="editorRef"
            :placeholder="placeholder"
            :height="`${keyboardHeight > 0 ? `calc(100vh - ${topHeight + toolTopKeyHeight + 100}px` : `calc(100vh - ${topHeight+othorHeight+100}px)`}`"
            @oncurLength="onHtmlChang" />
          <!-- 键盘弹出 -->
          <div v-if="keyboardHeight>0" :style="{ bottom: `${toolTopKeyHeight}px` }" class="fixed bottom-0px left-0 right-0 z-9999 border-t-2rpx border-hex-f5f5f5 border-solid">
            <div class="h-100rpx w-100% flex items-center bg-hex-fff px-32rpx leading-100rpx" @click="articleSelect">
              <image :src="`${cdnUrl}/svgicons/inputimg.svg${imgVersion}`" class="w-50rpx" mode="widthFix" />
            </div>
          </div>
        </div>
        <div v-if="keyboardHeight===0">
          <div class="tablist fixed bottom-370rpx left-0 right-0 z-99 h-102rpx bg-hex-FFFFFF px-32rpx" :class="{ 'bottom-720rpx': isShowColumn }">
            <div class="mb-24rpx flex items-center justify-between text-28rpx text-hex-7C8699" @click="handleShowColumn">
              <div>{{ columnName }}</div>
              <uni-icons :type="isShowColumn?'top':'bottom'" size="16" />
            </div>
            <div v-if="isShowColumn" class="columns mb-32rpx box-border max-h-350rpx overflow-y-auto rounded-30rpx bg-hex-F6F6F6 p-32rpx">
              <div v-for="item in categoryList" class="mb-32rpx text-28rpx text-hex-7c8699"
                   :class="columnName===item.name ? 'text-hex-000000 font-700 text-34rpx':''"
                   @click="changecolumnId(item)">{{ item.name }}</div>
            </div>
          </div>
          <div class="operate fixed bottom-210rpx left-0 right-0 z-99 h-192rpx bg-hex-F5F5F5">
            <div class="rounded-b-30rpx bg-hex-ffffff px-32rpx">
              <div class="h-2rpx w-full bg-hex-F5F5F5" />
              <div class="h-90rpx flex items-center">
                <image :src="`${cdnUrl}/svgicons/inputimg.svg${imgVersion}`" class="w-50rpx" mode="widthFix" @click="articleSelect" />
              </div>
              <div class="h-102rpx flex items-center justify-between">
                <div class="text-24rpx text-hex-7C8699"><text class="text-hex-C4C4C4">{{ articleTextNumber }}</text>/{{ articleMaxNum }}</div>
                <div class="flex items-center">
                  <div class="font-theme mr-32rpx text-28rpx" @click="goadd('2', '1')">存草稿</div>
                  <div class="btn-theme-bg h-62rpx min-w-140rpx rounded-12rpx text-center text-28rpx leading-62rpx text-hex-fff"
                       @click.stop="gonext">下一步</div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 传视频 -->
    <div v-if="tabindex==='3'" class="bg-hex-ffffff">
      <div class="box-border px-32rpx pb-370rpx">
        <x-video v-if="fileLists.length > 0" videoId="myVideo" class="w-full rounded-32rpx" :src="fileLists[0]" :progress="0.1" />
        <!--  <video v-if="fileLists.length > 0" id="myVideo" class="mb-54rpx w-full rounded-32rpx"
               :src="fileLists[0]"
               controls /> -->
        <div v-if="fileLists.length === 0"
             class="mb-20rpx h-152rpx w-152rpx flex flex-col items-center justify-center rounded-20rpx bg-hex-F5F5F5"
             @click="selectvideo">
          <uni-icons type="plusempty" size="30" color="#D9D9D9" />
        </div>
        <input v-model="videoTitle" type="text" class="mb-25rpx w-full text-36rpx" placeholder="请输入标题(限5-30字)">
        <!-- <textarea
          v-model="videocContent"
          class="mb-30rpx min-h-250rpx w-full"
          placeholder-style="color:#C4C4C4"
          auto-height="true"
          maxlength="500"
          placeholder="请输入正文(限500字)"
        /> -->
        <div class="max-h-600rpx overflow-y-scroll">
          <uni-easyinput v-model="videocContent" :inputBorder="false" bindinput="inputHandler" maxlength="500"
                         type="textarea"
                         autoHeight
                         placeholderStyle="color:#C4C4C4;font-size:32rpx"
                         placeholder="请输入正文(限500字)" />
        </div>
        <div class="tablist fixed bottom-320rpx left-0 right-0 z-99 h-102rpx bg-hex-FFFFFF px-32rpx" :class="{ 'bottom-620rpx': isShowColumn }">
          <div class="flex items-center justify-between pb-24rpx text-28rpx text-hex-7C8699" @click="handleShowColumn">
            <div>{{ columnName }}</div>
            <uni-icons :type="isShowColumn?'top':'bottom'" size="16" />
          </div>
          <div v-if="isShowColumn" class="columns box-border max-h-350rpx overflow-y-auto rounded-30rpx bg-hex-F6F6F6 p-32rpx">
            <div v-for="item in categoryList" class="mb-32rpx text-28rpx text-hex-7c8699"
                 :class="columnName===item.name ? 'text-hex-000000 font-700 text-34rpx':''"
                 @click="changecolumnId(item)">{{ item.name }}
            </div>
          </div>
        </div>
        <div class="operate fixed bottom-210rpx left-0 right-0 z-99 h-122rpx bg-hex-F5F5F5">
          <div class="rounded-b-30rpx bg-hex-ffffff px-32rpx">
            <div class="mb-11rpx h-2rpx w-full bg-hex-F5F5F5" />
            <div class="h-102rpx flex items-center justify-between">
              <div class="text-24rpx text-hex-7C8699"><text class="text-hex-C4C4C4">{{ videocContent?.length }}</text>/500</div>
              <div class="flex items-center">
                <div class="font-theme mr-32rpx text-28rpx" @click="goadd('3', '1')">存草稿</div>
                <div class="btn-theme-bg h-62rpx min-w-140rpx rounded-12rpx text-center text-28rpx leading-62rpx text-hex-fff"
                     @click.stop="goadd('3', '0')">发布</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- 上传封面 -->
    <div v-if="tabindex==='2' && secondindex ==='2'" class="bg-hex-ffffff">
      <div class="box-border px-32rpx pb-370rpx">
        <div class="w-50% overflow-hidden rounded-32rpx shadow">
          <div class="h-286rpx flex flex-col items-center justify-center bg-hex-F5F5F5" @click="firstSelect">
            <div v-if="coverImg" class="relative h-286rpx w-100% overflow-hidden">
              <image
                class="absolute left-50% top-50% h-286rpx w-100% rounded-16rpx"
                style="transform: translate(-50%, -50%);"
                :src="coverImg"
                mode="aspectFill"
              />
            </div>
            <div v-else class="flex flex-col items-center justify-center bg-hex-F5F5F5">
              <uni-icons type="plusempty" size="40" color="#D9D9D9" />
              <div class="mt-24rpx text-hex-D9D9D9">上传封面</div>
            </div>
          </div>
          <div class="box-border p-24rpx">
            <div class="multiLine-hiddle mb-24rpx">{{ articleTitle }}</div>
            <div class="flex items-center justify-between">
              <div class="flex items-center justify-between">
                <image
                  class="mr-12rpx h-44rpx w-44rpx rounded-50%"
                  :src="user.avatar_url"
                  mode="scaleToFill"
                />
                <text class="text-24rpx text-hex-7C8699">{{ user.nickname }}</text>
              </div>
              <div class="mr-13rpx text-60rpx text-hex-ABAFB5">
              <!-- <image :src="`${cdnUrl}/imgs/square/more.png${imgVersion}`" mode="widthFix" class="w-44rpx" /> -->
              </div>
            </div>
          </div>
        </div>
        <div class="fixed bottom-210rpx left-0 right-0 z-99 h-102rpx bg-hex-F5F5F5">
          <div class="rounded-b-30rpx bg-hex-ffffff px-32rpx">
            <div class="h-102rpx flex items-center justify-between">
              <div class="text-28rpx text-hex-7C8699" />
              <div class="flex items-center">
                <div class="font-theme mr-32rpx text-28rpx" @click="goadd('2', '1')">存草稿</div>
                <div class="btn-theme-bg h-62rpx min-w-140rpx rounded-12rpx text-center text-28rpx leading-62rpx text-hex-fff"
                     @click.stop="goadd('2', '0')">发布</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div v-if="keyboardHeight===0" class="fixed bottom-0 left-0 right-0 z-99 z-999 h-108rpx w-full overflow-hidden overflow-hidden bg-hex-F5F5F5" @click="navTo('/pages-square/drafts')">
      <div class="h-100% flex flex-col items-center overflow-hidden rounded-t-30rpx bg-hex-ffffff">
        <div class="mb-24rpx mt-12rpx h-8rpx w-64rpx rounded-10rpx bg-hex-EAEAEA" />
        <div class="font-theme text-28rpx">草稿箱({{ draftTotal }})</div>
      </div>
    </div>
    <div v-if="isShowPreview">
      <q-preview-image :urls="showImgsList" :current-index="currentIndexPre" :isShowDownLoad="false"
                       @close="closePreview" />
    </div>
  </div>

</template>

<script setup lang="ts">
import { useUserStore } from '@/stores/user'

const { user } = useUserStore()
let searchBarTop: any = $ref('24')
onLoad(() => {
  // #ifndef H5
  let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
  searchBarTop = menuButtonInfo.top
  // #endif
})

let tabList: any = $ref([
  { id: '1', text: '发动态' },
  { id: '2', text: '写文章' },
  { id: '3', text: '传视频' },
])
let topHeight = $ref(0)
let othorHeight = $ref(0)
//键盘弹起的上传图片的工具栏
let devive = $ref('ios')
const toolTopKeyHeight = $computed(() => {
  return devive === 'ios' ? keyboardHeight : 0
})

//键盘高度
let keyboardHeight = $ref(0)
const updatePosition = (height) => {
  keyboardHeight = height
}
let editorRef: any = $ref(null)

//监听富文本输入的内容统计字数
const onHtmlChang = (conut) => {
  articleTextNumber = conut
  if (conut > 500) {
    uni.showToast({
      title: '超过字数',
      icon: 'none',
      mask: false,
    })
  }
}
const placeholder: any = $computed(() => {
  return articleTextNumber === 0 && '请输入正文(限500字)'
})
//获取富文本内容
const getEditorHtml = () => {
  return new Promise((resolve, reject) => {
    editorRef.editorCtx.getContents({
      success: (res) => {
        function traverse() {
          let imgIndex = 0
          let result: any = []
          res.delta.ops.forEach((item) => {
            if (typeof item.insert === 'string') {
              console.log(item.insert, '+++++++++++++')

              result.push({ type: 'text', content: item.insert })
            } else {
              result.push({ type: 'img', content: item.insert.image, index: imgIndex })
              imgIndex++
            }
          })
          return result
        }
        const contenJson = traverse()
        resolve(contenJson)
      },
      fail: (error) => {
        reject(error)
      },
    })
  })
}

//富文本上传
const uplodImg = (fileUrl: string) => {
  editorRef.editorCtx.insertImage({
    src: fileUrl,
  })
}
// 获取类目列表数据
let categoryList: any = $ref([])
const getcategoryList = async () => {
  const { status, data } = await Fetch('/api/s/square/columnList')
  if (status === 200 && data.code === 0) {
    categoryList = data.result.dataList
    categoryList.splice(0, 1)
  }
}
const goBack = () => {
  uni.switchTab({ url: '/pages/square' })
}
// 发动态--------------------------
let fileLists: any = $ref([])
const select = async () => {
  await chooseImage({
    count: 3, //默认9
    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
    sourceType: ['album', 'camera'], //从相册或者拍照选择
    async success(res: any) {
      for (let i = 0; i < res.tempFiles.length; i++) {
        const fileUrl = await uploadCosFile(res.tempFiles[i], res.tempFiles[i].path)
        fileLists.push(fileUrl)
        showImgsList = fileLists
      }
    },
  })
}
const deleteImg = (index) => {
  fileLists.splice(index, 1)
}
// 发动态的文本
let dynamicContent: any = $ref('')

let tabindex: any = $ref('2')
// 控制下一步的页面
let secondindex: any = $ref('1')
// 类目id
let isShowColumn = $ref(false)
let columnName = $ref('栏目选择')
let columnId: any = $ref(2)
const handleShowColumn = () => {
  isShowColumn = !isShowColumn
}
const changecolumnId = (item) => {
  columnId = item.id
  columnName = item.name
  isShowColumn = false
}
// 发动态预览
let showImgsList: any = $ref([])
let isShowPreview: any = $ref(false)
let currentIndexPre: any = $ref(1) //预览图片位置
const previewImage = (index) => { // index 索引 如果 需要复用方法 可以使用 类型来进行区分(val)
  currentIndexPre = index
  isShowPreview = true
}
const closePreview = () => {
  isShowPreview = false
}
// 发文章----------------------
let articleTitle: any = $ref('')
let articlecontent: any = $ref('')
let articleList: any = $ref([])
let articleTextNumber: any = $ref(0)//文章输入字符的长度
const articleMaxNum: any = $ref(500)
// 封面图片
let coverImg: any = $ref('')

let currentIndex = $ref(0)
const articleSelect = async () => {
  await chooseImage({
    count: 1, //默认9
    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
    sourceType: ['album', 'camera'], //从相册选择
    async success(res: any) {
      for (let i = 0; i < res.tempFiles.length; i++) {
        const fileUrl = await uploadCosFile(res.tempFiles[i], res.tempFiles[i].path)
        fileLists.push(fileUrl)
        articleList.push({ type: 'img', index: currentIndex, content: fileUrl })
        uplodImg(fileUrl)
      }
      let textList = []
      textList = articleList.filter((item) => {
        return item.type === 'img'
      })
      showImgsList = []
      textList.forEach((item: any) => {
        showImgsList.push(item.content)
      })
      currentIndex++
    },
  } as any)
}
//用户信息
const getUserInfo = async () => {
  // const reqData = { method: 'post' }
  // const { data, status, error } = await Fetch('/api/s/user/userinfo', reqData)
}
// let articlePlaceholder = $ref('请输入正文(限500字)')
const initHtml = () => {
  uni.onKeyboardHeightChange((res: any) => {
    if (res.height === keyboardHeight) return
    const duration = res.height > 0 ? res.duration * 1000 : 0
    keyboardHeight = res.height
    setTimeout(() => {
      uni.pageScrollTo({
        scrollTop: 0,
        success: () => {
          updatePosition(keyboardHeight)
          editorRef.editorCtx.scrollIntoView() //使得编辑器光标处滚动到窗口可视区域内
        },
      })
    }, duration)
  })
  uni.createSelectorQuery().select('.wealth-text').boundingClientRect((rect: any) => {
    topHeight = rect?.top
  }).exec()
  uni.createSelectorQuery().selectAll('.operate, .tablist, .footer-tab').boundingClientRect((rect: any) => {
    othorHeight = rect.reduce((sum, obj) => sum + obj.height, 0)
  }).exec()
  const system = uni.getSystemInfo({
    success: e => {
      devive = e.platform
    },
  })
}
// 改变tab栏标签
const changetabindex = (index) => {
  fileLists = []
  articleList = []
  showImgsList = []
  videocContent = ''
  fileLists = []
  videoTitle = ''
  dynamicContent = ''
  articlecontent = ''
  coverImg = ''
  articleTitle = ''
  isShowColumn = false
  tabindex = index
  secondindex = '1'
  articleTextNumber = 0
}

// 写文章下一步
const gonext = useDebounceFn(async () => {
  if (articleTextNumber === 0 || articleTitle === '') {
    uni.showToast({ title: '文章标题及内容不能为空', icon: 'none', duration: 2000 })
    return
  }
  if (articleTitle.length < 5) {
    uni.showToast({ title: '标题长度需在5至30位之间', icon: 'none', duration: 2000 })
    return
  }
  const dataList: any = await getEditorHtml()
  let listImage = dataList.filter(item => item.type === 'img')
  if (listImage.length === 0 || fileLists.length === 0) {
    articleList = []
    uni.showToast({ title: '请上传图片', icon: 'none', duration: 2000 })
    return
  }
  if (articleTextNumber > 500) {
    uni.showToast({
      title: '超过字数',
      icon: 'none',
      mask: false,
    })
    return
  }
  secondindex = '2'
}, 500)
//上传文章封面
const firstSelect = async () => {
  await chooseImage({
    count: 1, //默认9
    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
    sourceType: ['album', 'camera'], //从相册选择
    async success(res: any) {
      for (let i = 0; i < res.tempFiles.length; i++) {
        const fileUrl = await uploadCosFile(res.tempFiles[i], res.tempFiles[i].path)
        coverImg = fileUrl
      }
    },
  })
}
const goback = () =>
{
  uni.navigateBack({
    delta: 1,
  })
}
// 发视频----------------------------
let videocContent: any = $ref('')
let videoTitle: any = $ref('')
const selectvideo = async () => {
  await chooseVideo({
    async success(res: any) {
      const fileUrl = await uploadCosFile(res.tempFile, res.tempFilePath)
      fileLists.push(fileUrl)
    },
  })
  uni.hideLoading()
}
//草稿箱列表
let pageNo = $ref(1)
const pageSize = $ref(4)
let draftTotal = $ref(0)
const getDraftList = async () => {
  const reqData = { method: 'get', data: { pageNo, pageSize } }
  const { data, status, error } = await Fetch('/qqyapi/auth/article/userDraftArticle', reqData)
  if (data.code === 0) {
    draftTotal = Number(data.result.total)
  }
}
// 发布
const addArticle = async (articleType, columnId, content1, coverImage, isDraft, multiMedia, title) => {
  if (!content1) {
    uni.showToast({
      title: '请上传文字内容',
      icon: 'none',
      duration: 2000,
    })
    return
  }
  if (!multiMedia) {
    uni.showToast({
      title: '请上传图片',
      icon: 'none',
      duration: 2000,
    })
    return
  }
  uni.showLoading({
    title: '保存中',
    mask: true,
  })
  const reqData = {
    method: 'post',
    data: {
      'articleType': articleType,
      'columnId': columnId,
      'content': content1,
      'coverImage': coverImage,
      'isDraft': isDraft,
      'multiMedia': multiMedia,
      'title': title,
    },
  }
  const { data, status } = await Fetch('/qqyapi/auth/article/addArticle', reqData)
  if (data.code === 0) {
    currentIndex = 0
    coverImg = ''
    setTimeout(() => {
      if (isDraft === '1') {
        uni.hideLoading()
        uni.navigateTo({
          url: '/pages-square/drafts',
        })
      } else {
        uni.hideLoading()
        uni.reLaunch({
          url: '/pages/square',
        })
      }
    }, 1600)
  }
}
// 点击发布的事件 1发动态  2发文章   3传视频
const goadd = useThrottleFn(async (type, draft) => {
  let jsonArticleList = type === '2' && JSON.stringify(await getEditorHtml())
  let videocover = ''
  switch (type) {
    case '1':
      addArticle('0', columnId, dynamicContent, fileLists[0], draft, fileLists.join(','), '动态无标题')
      break
    case '2':
      if (!coverImg) {
        uni.showToast({
          title: '请上传封面',
          icon: 'none',
          duration: 2000,
        })
        return
        //coverImg = fileLists[0]
      }
      addArticle('1', columnId, jsonArticleList, coverImg, draft, fileLists.join(','), articleTitle)
      // articlecontent = ''
      // coverImg = ''
      // fileLists = []
      // articleTitle = ''
      // articleList = []
      break
    case '3':
      videocover = await getvideoimg(fileLists[0])
      if (!videocover) {
        uni.showToast({
          title: '请上传视频',
          icon: 'none',
          duration: 2000,
        })
        return
      }
      if (videoTitle.length < 5) {
        uni.showToast({
          title: '标题长度需在5至30位中间',
          icon: 'none',
          duration: 2000,
        })
        return
      }
      await addArticle('2', columnId, videocContent, formatVidelUrl + videocover, draft, fileLists.join(','), videoTitle)
      // videocContent = ''
      // fileLists = []
      // videoTitle = ''
      break
    default:
      break
  }
}, 1000)
let formatVidelUrl = 'https://qqy-1254346585.cos.ap-nanjing.myqcloud.com/'
const getvideoimg = async (url) => {
  if (!url) {
    return
  }
  const formatUrl = url.replace(formatVidelUrl, '')
  const reqData = {
    method: 'post',
    data: {
      'videoPath': formatUrl,
    },
  }
  const { data, status } = await Fetch('/qqyapi/auth/oss/videoShotImage', reqData)
  const videlImg = data?.result
  return videlImg
}

onMounted(() => {
  getUserInfo()
  getcategoryList()
  getDraftList()
  initHtml()

})
</script>

<style lang="scss">
.public{
  .multiLine-hiddle{
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .triangle{
    width: 0;
    height: 0;
    border-color: transparent #fff; /* 上下颜色 左右颜色 */
    border-width: 0 0 24rpx 24rpx;
    border-style: solid;
  }

  ::v-deep(.uni-textarea-wrapper)  {
    .uni-textarea-wrapper{
      font-size: 32rpx !important;
      color: #7C8699,
    }
  }

  ::v-deep .uni-easyinput__content {
    height: 650rpx;
  }
}

.ql-editor.ql-blank::before {
  color: #C4C4C4 ;
  font-style: normal;
  font-size: 28rpx;
}
</style>
